/**
 * 自定义时间选择组件,由下拉选择组件+时间区间组件组成，当下拉选择组件选择“自由选择”，时间区间可操作
 * by zhangxinyue
 * create 2020-09-01
 */
import React, { PureComponent } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'dva';
import SelectC from '../SelectC';
import SimpleRangeDateC from './simpleRangeDateC';
import { FormItemLayout } from '../formPub';
import moment from 'moment';
import styles from './style.less';

class ComplexDateC extends PureComponent {
  // props默认值
  static defaultProps = {
    title: '日期区间', // 默认名称
    initialValue: undefined, // 无默认值(type:下拉index，beginDate：开始时间，endDate：结束时间)
    helper: '', // 下拉框提示信息，默认无提示信息
    startOnChange: () => {}, // 开始时间变更事件
    endOnChange: () => {}, // 结束时间变更事件
    selOnChange: () => {}, // 下拉选择变更事件
    hasDataBD: '', // 默认有数据的起始时间为''，不纳入起止时间计算
    hasDataED: '', // 默认有数据的结束时间为''，不纳入起止时间计算
    onRef: () => {}, // 本组件的引用
    formItemLayout: FormItemLayout, // 布局
    disabled: false, // 默认不禁用
    selfDefination: undefined, // 默认不自定义下拉菜单
    labalWrap: false, // 默认title不换行
    styleRow: {},
    previousDateType: undefined, // 1:交易所 ,2:银行间
  };

  constructor(props) {
    super(props);

    // 父组件对本组件的引用
    this.props.onRef(this);

    const type = props.initialValue ? props.initialValue.type : -1; // 下拉选项选中的内容
    this.state = {
      selType: type, // 下拉选项选中的内容
      selDataSoure: [], // 下拉数据源
      loading: true, // 标记下拉数据是否加载完毕
      previousDate: undefined, // 前一交易日 t-1
    };
    // 记录初始化值，因为从外界调用form的resetFields方法时，未将代表当前选中的下拉设置为初始化
    this.initSelType = type;
  }

  UNSAFE_componentWillReceiveProps(nextProps) {
    // 计算props的默认开始时间和结束时间，若为传值，则为null，否则转换成对应的字符串
    const type = this.props.initialValue ? this.props.initialValue.type : undefined;
    const beginDate = this.props.initialValue ? this.props.initialValue.beginDate : undefined;
    const endDate = this.props.initialValue ? this.props.initialValue.endDate : undefined;

    const typeN = nextProps.initialValue ? nextProps.initialValue.type : undefined;
    const beginDateN = nextProps.initialValue ? nextProps.initialValue.beginDate : undefined;
    const endDateN = nextProps.initialValue ? nextProps.initialValue.endDate : undefined;

    if (type !== typeN) {
      // 设置下拉选项
      this.state.SelectC.setSelect(typeN);
      this.setState({
        selType: typeN,
      });
      this.initSelType = typeN;
    }
    if (beginDate !== beginDateN || endDate !== endDateN) {
      // 设置开始时间和结束时间
      this.state.SimpleRangeDateC?.setDate(beginDateN, endDateN);
    }
  }

  // 非初始化状态下更改下拉选项、开始时间和结束时间（供父组件调用）
  setSelctAndDate(type, beginDate, endDate) {
    // 修改下拉选项值
    this.state.SelectC.setSelect(type);
    // 修改开始日期和结束日期
    this.state.SimpleRangeDateC.setDate(beginDate, endDate);

    // 设置下拉选项内容
    this.setState({
      selType: type,
    });
  }

  // 外界调用了form的resetFields方法，需同时调用该方法
  reset = () => {
    this.state.SimpleRangeDateC.reset();
    this.setState({
      selType: this.initSelType,
    });
  };

  // 自定义下拉菜单
  selDefSelect = [
    { title: '用户自定义', value: '0' },
    { title: '本月', value: '1' },
    { title: '本季度', value: '2' },
    { title: '本年度', value: '3' },
    { title: '近一个月', value: '4' },
    { title: '近三个月', value: '5' },
    { title: '近六个月', value: '6' },
    { title: '近一年', value: '7' },
    { title: '近三年', value: '8' },
  ];

  // 获取前1交易日
  getPreviousDate = () => {
    this.props.dispatch({
      type: `globalM/getTradingDate`,
      payload: { type: this.props.previousDateType },
      callback: (res) => {
        this.setState({
          previousDate: moment(res).format('YYYY-MM-DD'),
        });
      },
    });
  };
  componentDidMount() {
    if (this.props.previousDateType) this.getPreviousDate();
    const {
      globalM: {
        dataDictionary: { TIME_RANGE = [] },
      },
    } = this.props;
    if (this.props.selfDefination != undefined) {
      // 解析传参与可供选择的自定义下拉，构建下拉菜单
      const tempSel = [];
      this.props.selfDefination.forEach((element) => {
        const find = this.selDefSelect.filter((item) => item.value === element);
        if (find && find.length > 0) {
          tempSel.push(find[0]);
        }
      });
      this.setState({
        selDataSoure: tempSel,
        loading: false,
      });
    } else {
      // 非自定义，可从字典中获取枚举
      const ds = [];
      TIME_RANGE.forEach((element) => {
        if (element.value != 5) {
          // 0602迭代--调整所有绩效分析涉及时间区间去除近三年选项
          ds.push({
            title: element.code,
            value: element.value,
          });
        }
      });
      this.setState({
        selDataSoure: ds,
        loading: false,
      });
    }
  }

  // 响应第一级下拉选项变更事件，设定下拉选项对应的时间区间
  selectedOnChange = (e) => {
    // 置空开始时间和结束时间
    this.state.SimpleRangeDateC.setDate('', '');
    // 抛出事件，若需要更改开始日期和结束日期，则由外部调研在获取到该事件后，通过ref方式修改
    this.props.selOnChange(e);
    // 设置下拉选项内容
    this.setState({
      selType: e,
    });

    // 若是自定义模式，则前端自行计算开始时间和结束时间
    if (this.props.selfDefination != undefined) {
      const endDate = this.state.previousDate ? moment(this.state.previousDate) : moment();
      let beginDate = '';
      switch (e) {
        case '1': // 本月
          beginDate = moment(`${moment().format('YYYY-MM')}-01`);
          break;
        case '2': // 本季度
          const month = moment().format('MM');
          // 第一季度
          if (month >= '01' && month <= '03') {
            beginDate = moment(`${moment().format('YYYY')}-01-01`);
          }
          // 第二季度
          if (month >= '04' && month <= '06') {
            beginDate = moment(`${moment().format('YYYY')}-04-01`);
          }
          // 第三季度
          if (month >= '07' && month <= '09') {
            beginDate = moment(`${moment().format('YYYY')}-07-01`);
          }
          // 第四季度
          if (month >= '10' && month <= '12') {
            beginDate = moment(`${moment().format('YYYY')}-10-01`);
          }
          break;
        case '3': // 本年度
          beginDate = moment(`${moment().format('YYYY')}-01-01`);
          break;
        case '4': // 近一个月
          beginDate = this.props.previousDateType ? moment().subtract(1, 'M') : moment().subtract(1, 'M').add(1, 'd');
          break;
        case '5': // 近三个月
          beginDate = this.props.previousDateType ? moment().subtract(3, 'M') : moment().subtract(3, 'M').add(1, 'd');
          break;
        case '6': // 近六个月
          beginDate = this.props.previousDateType ? moment().subtract(6, 'M') : moment().subtract(6, 'M').add(1, 'd');
          break;
        case '7': // 近一年
          beginDate = this.props.previousDateType ? moment().subtract(1, 'y') : moment().subtract(1, 'y').add(1, 'd');
          break;
        case '8': // 近三年
          beginDate = this.props.previousDateType ? moment().subtract(3, 'y') : moment().subtract(3, 'y').add(1, 'd');
          break;
      }
      if (beginDate != '') {
        this.state.SimpleRangeDateC.setDate(beginDate, endDate);
      }
    }
  };

  render() {
    const {
      styleRow,
      helper,
      title,
      form,
      startIndex,
      endIndex,
      hasDataBD,
      hasDataED,
      initialValue,
      disabled,
      startOnChange,
      endOnChange,
      loading,
      selectIndex,
      formItemLayout,
      selfDefination,
      labalWrap,
      disabledEndForm,
    } = this.props;
    return (
      <div className={styles.selectContent} style={{ display: 'flex' }}>
        {/* 下拉组件 */}
        <SelectC
          title={title} // 显示名称
          form={form} // form对象
          helper={helper}
          labalWrap={labalWrap} // 提示信息
          dataIndex={selectIndex} // 下拉组件的唯一标识符
          initialValue={initialValue && initialValue.type} // 初始下拉选项（只适用于初始化赋值）
          allowClear={false} // 不允许“清除”按钮
          placeholder='请选择' // 占位符
          loading={loading === undefined ? this.state.loading : false} // 等待加载状态(优先展示props的loading)
          onChange={this.selectedOnChange} // 下拉选择变更时事件
          dataSource={this.state.selDataSoure} // 下拉框数据源
          onRef={(ref) => this.setState({ SelectC: ref })} //  下拉组件的ref，可调用子组件方法
          // 根据时间区间是否显示调整下拉选项的样式
          style={{ width: '50%' }}
          formItemLayout={formItemLayout}
          disabled={disabled}
        />
        {/* 时间区间组件 */}
        <SimpleRangeDateC
          form={form} // form对象
          startIndex={startIndex} // 开始时间唯一标识符
          endIndex={endIndex} // 结束时间唯一标识符
          startInitial={initialValue && initialValue.beginDate} // 开始时间初始默认值（只适用于初始化赋值）
          endInitial={initialValue && initialValue.endDate} // 结束时间初始默认值（只适用于初始化赋值）
          disableStart={hasDataBD} // 设置当前的开始时间不能早于该值，为''时，不将该值用于计算开始时间的禁用范围
          disableEnd={hasDataED} // 设置当前的结束时间不能晚于该值，为''时，不将该值用于计算结束时间的禁用范围
          startOnChange={startOnChange} // 开始时间变化时的回调
          endOnChange={endOnChange} // 结束时间变化时的回调
          disabledEndForm={disabledEndForm} // 禁用结束日期
          disabled={disabled || this.state.selType != '0'} // 选中非“用户自定义”时则禁用
          onRef={(ref) => {
            this.setState({ SimpleRangeDateC: ref });
          }} // 时间区间组件的ref，可调用子组件方法
          style={
            styleRow ? { display: 'flex', width: `${(50 * 22) / 24}%`, marginBottom: '10px', paddingLeft: '10px', ...styleRow } : { display: 'flex', width: `${(50 * 22) / 24}%` }
          } // 宽度按layout属性同比算的
        />
      </div>
    );
  }
}

// props类型
ComplexDateC.propsTypes = {
  labalWrap: PropTypes.bool, // 支持标题换行
  form: PropTypes.object, // form对象
  title: PropTypes.string, // 显示名称
  selectIndex: PropTypes.string, // Form识别的下拉选项Item ID
  startIndex: PropTypes.string, // Form识别的开始时间Item ID
  endIndex: PropTypes.string, // Form识别的结束时间Item ID
  initialValue: PropTypes.object, // 初始默认值(type:下拉index，beginDate：开始时间，endDate：结束时间)
  helper: PropTypes.oneOfType([
    // 提示帮助信息
    PropTypes.string,
    PropTypes.element,
  ]),
  loading: PropTypes.bool, // 等待加载
  startOnChange: PropTypes.func, // 起始时间变化事件
  endOnChange: PropTypes.func, // 结束时间变化事件
  selOnChange: PropTypes.func, // 下拉选择变更事件
  hasDataBD: PropTypes.object, // 有数据的的起始时间,若不传，则该字段不影响起止时间的计算，若获取的有数据的时段为空，则需传null，此时会影响起止时间的计算和自由选择时可选时间范围的选择
  hasDataED: PropTypes.object, // 有数据的结束时间，若不传，则该字段不影响起止时间的计算，若获取的有数据的时段为空，则需传null，此时会影响起止时间的计算和自由选择时可选时间范围的选择
  formItemLayout: PropTypes.object, // 布局
  disabled: PropTypes.bool, // 禁用
  selfDefination: PropTypes.array, // 自定义下拉菜单
  disabledEndForm: PropTypes.bool, // 禁用结束日期
  previousDateType: PropTypes.number, // 前一交易日类型 1:交易所 ,2:银行间
};

export default connect(({ globalM, loading }) => ({ globalM, loading }))(ComplexDateC);
